<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>百度账号注册</title>
</head>
<style>
     .text_input {
        display: block;
        position: relative;
        height: 20px;
        padding: 10px 8px;
        border: 1px solid #ddd;
        transition: .3s;
        font-size: 14px;
        color: #666;
        width: 328px;
    }
    .label1 {
        display: block;
        float: left;
        height: 42px;
        width: 65px;
        margin-right: 10px;
        line-height: 42px;
        font-size: 14px;
        color: #666;
        font-weight: 700;
        text-align: right;
    }
    .text_input2 {
        display: block;
        position: relative;
        float: left;
        height: 16px;
        width: 156px;
        padding: 11px 10px;
        margin-right: 10px;
        border: 1px solid #ddd;
        font-size: 14px;
        color: #666;
        transition: .3s;
    }
    .text_button {
        border-radius: 0;
        border: 1px solid #ddd;
        height: 40px;
        background: #f7f7f7;
        color: #666;
        font-weight: 400;
        width: 160px;
        float: left;
        margin-right: 10px;
        font-size: 14px;

}
    .label2{
        margin-left: 75px;
        position: relative;
        clear: both;
        margin-bottom: 20px;
        zoom: 1;
        font-size: 12px;
    }
    a{
        text-decoration: none;
        color: #1b66c7;
    }
    .button2{
        margin-left: 75px;

        display: block;
        font-size: 16px;
        font-weight: 700;
        border-radius: 3px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        transition: .3s;
        -moz-transition: .3s;
        -o-transition: .3s;
        -webkit-transition: .3s;

        height: 50px;
        color: #fff;
        cursor: pointer;
        text-align: center;
        border: 0;
        background: url(http://passport.baidu.com/static/passpc-base/img/ui/button_icon.png) no-repeat 0 0;
        line-height: 32px;

        width: 350px;
        background: #3f89ec;

    }
</style>
<body>
    <form method="post">
        <label class="label1" for="text1">用户名</label>
        <input id="text1" class="text_input" type="text" name="userName" placeholder="请设置用户名"><br>
        <label class="label1" for="text2">手机号</label>
        <input id="text2" class="text_input" type="text" name="iphone" placeholder="可用于登录和找回密码"><br>
        <label class="label1" for="text3">&nbsp;密码</label>
        <input id="text3" class="text_input" type="password" name="password" placeholder="可用于登录和找回密码"><br>
        <label class="label1" for="text4">验证码</label>
        <input id="text4" class="text_input2" type="text" name="verifyCode" maxlength="6" placeholder="请输入验证码">
        <input class="text_button" type="button" value="获取短信验证码"><br><br><br>

        <p class="label2">
            <input name="isAgree" id="isAgree" type="checkbox" autocomplete="off">
            <label  for="isAgree">阅读并接受</label>
            <a target="_blank" href="http://passport.baidu.com/static/passpc-account/html/protocal.html">《百度用户协议》</a>及<a target="_blank" href="https://www.baidu.com/duty/yinsiquan.html">《百度隐私权保护声明》</a>
            <a><span></span></a>
        </p>

        <input type="submit" value="注册" class="button2">
    </form>
</body>
</html>